<script setup lang="ts">
function handleClickLeft() {
  uni.navigateBack()
}
</script>

<template>
  <view class="h-full flex flex-col overflow-hidden">
    <wd-navbar title="必点菜方案" left-text="返回" left-arrow @click-left="handleClickLeft" />
    <scroll-view
      scroll-y
      class="box-border flex-1 overflow-hidden p-[10px]"
      :show-scrollbar="false"
    >
      <view class="rounded-lg bg-white p-[10px]">
        <wd-text text="开台必点" size="18px" color="#333" />
        <view class="mt-1">
          <wd-tag type="success" plain class="mr-1">已启用</wd-tag>
          <wd-text text="门店自建" size="12px" />
        </view>
      </view>
      <view class="mt-3 overflow-hidden rounded-lg">
        <wd-cell-group>
          <wd-cell title="方案适用渠道" center value="店内收银、扫码点餐" is-link />
          <wd-cell title="桌台区域" center value="大厅、包间" is-link />
          <wd-cell title="必点类型" center value="每人必点 1 份" />
          <wd-cell title="必点规则" center value="固定菜品" />
          <wd-cell title="必点菜品" center value="白米饭" is-link />
          <wd-cell title="有效期" center value="永久有效" />
          <wd-cell title="星期" center value="星期一/二/三/四/五/六/日" title-width="40%" />
          <wd-cell title="时间" center value="0:00:00 至 23:59:59" />
        </wd-cell-group>
      </view>
      <view class="mt-3 overflow-hidden rounded-lg">
        <wd-cell-group>
          <view class="px-[15px] py-[10px]">
            <wd-text text="高级设置" size="14px" color="#333" />
          </view>
          <wd-cell title="自动加入购物车" value="是" />
          <wd-cell title="适用渠道" value="店内收银、扫码点餐" is-link />
          <wd-cell title="顾客是否可修改必点数量" value="是" />
          <wd-cell title="下单时检查必点菜品" value="是" />
          <wd-cell title="结账时检查必点菜品" value="是" />
        </wd-cell-group>
      </view>
    </scroll-view>
    <view class="flex border-t-1 border-border border-t-solid bg-white p-4">
      <wd-button type="text">
        <view class="flex flex-col items-center justify-center">
          <view class="i-carbon-trash-can text-main" />
          <text class="mt-1 text-[10px] text-main leading-none">删除</text>
        </view>
      </wd-button>
      <wd-button type="text" class="ml-6">
        <view class="flex flex-col items-center justify-center">
          <view class="i-carbon-close-outline text-main" />
          <text class="mt-1 text-[10px] text-main leading-none">停用</text>
        </view>
      </wd-button>
      <wd-button type="primary" :round="false" class="ml-4 flex-1">编辑</wd-button>
    </view>
  </view>
</template>

<style scoped lang="scss">
:deep(.wd-cell__title) {
  color: #676869;
}
</style>
